<!--
Date: 2025-08-13
Copyright (c) 2025 Industrial Software Feature Database
-->
<template>
  <div class="skin_library">
    <div class="mb-[10px]">
      <el-card shadow="hover">
        <el-form ref="queryFormRef" :model="queryParams" :inline="true" size="small" label-width="120px">
          <el-form-item label="铺层代码" prop="plyCode">
            <el-input v-model="queryParams.plyCode" placeholder="请输入" clearable />
          </el-form-item>
          <el-form-item style="padding-left: 120px">
            <el-button type="primary" icon="search" @click="doQuery">查询</el-button>
            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
          </el-form-item>
        </el-form>
      </el-card>
    </div>
    <el-card shadow="hover">
      <el-table v-loading="loading" :data="skinList">
        <el-table-column :label="item.label" v-for="item in defaultColunms" :key="item.label" :prop="item.prop" :fixed="item.fixed" />
      </el-table>
      <div class="pagenation">
        <pagination
          v-show="total > 0"
          style="margin-top: 0;"
          v-model:page="queryParams.pageNum"
          v-model:limit="queryParams.pageSize"
          :total="total"
          :background="false"
          layout="total, sizes, prev, pager, next, jumper"
          @pagination="handleCurrentChange"
        />
      </div>
    </el-card>
  </div>
</template>
<script name="eqMaterial" setup>
import { getLayerList } from '@/api/layerLibrary';

const skinList = ref([]);
const total = ref(0);
const loading = ref(false);
const queryParams = ref({
  pageNum: 1,
  pageSize: 10,
  plyCode: '',
  symmetrical: '',
  isAsc: 'descending'
});
const defaultColunms = ref([
  { label: '铺层代码', prop: 'plyCode', fixed: 'left' },
  { label: 'Exx', prop: 'exx', fixed: null },
  { label: 'Eyy', prop: 'eyy', fixed: null },
  { label: 'Gxy', prop: 'gxy', fixed: null },
  { label: 't', prop: 't', fixed: null },
  { label: '对应PCOMP编号', prop: 'pcompNumber', fixed: null },
  { label: 'Rho密度', prop: 'rho', fixed: null },
  { label: 'αx', prop: 'x', fixed: null },
  { label: 'αy', prop: 'y', fixed: null },
  { label: 'αxy', prop: 'xy', fixed: null }
]);
const resetQuery = () => {
  queryParams.value = {
    pageNum: 1,
    pageSize: 10,
    attributeCode: '',
    orderByColumn: 'createTime',
    isAsc: 'descending'
  };
  doQuery();
};
const doQuery = () => {
  skinList.value = [];
  loading.value = true;
  getLayerList(queryParams.value)
    .then((res) => {
      if (res) {
        // 处理铺层
        const data = res?.rows?.map((el) => {
          return { ...el, ...el.equivalentMaterial };
        });
        skinList.value = data;
        total.value = res.total;
      }
    })
    .finally(() => {
      loading.value = false;
    });
};
const handleCurrentChange = () => {
  doQuery();
};
onMounted(() => {
  doQuery();
});
</script>
<style lang="scss" scoped>
.skin_library {
  height: calc(100vh - 155px);
  overflow: auto;
  width: 100%;
  .pagenation {
    display: flex;
    justify-content: end;
    margin-top: 10px;
  }
}
</style>